<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>更新用户信息页面</title>
  <script src="jquery-3.6.0.js"></script>
</head>
<body>
主键：<input type="text" id="id" readonly><br>
用户名：<input type="text" id="username"><br>
密码：<input type="password" id="password"><br>
年龄：<input type="text" id="age"><br>
<button id="update">更新</button>
</body>
<script>
    // 国际化标准代码，获取地址栏中，指定的key对应的value值
    function GetQueryString(name) {
        var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if(r!=null)return  unescape(r[2]); return null;
    }
    // 调用方法
    var id = GetQueryString("id");

    $(function (){
        $.ajax({                    // 标准化模板，不用死记  // jquery中的任何属性名称，不能错误，并且一定区分大小写，所以建议在开发中，尽可能使用ctrl+c复制在修改
            url:"/selectUserByIdServlet",   // 请求路径
            type:"get",            // 请求的方式，不区分大小写
            async:true,             // 是否异步，true是默认值，false为同步请求
            cache:false,            // 关闭缓存，目的是为了避免部分浏览器缓存加载出错(IE)
            datatype:"json",        // 返回类型，text文本、html页面、json数据
            data:{// 传递给后台参数名和参数值
                id:id
            },
            success:function(response){        // 如果后端响应成功，则会返回所有数据给到response对象中
                console.log(response);
                if(response.code === 200) {
                    $("#id").val(response.user.id);
                    $("#username").val(response.user.username);
                    $("#password").val(response.user.password);
                    $("#age").val(response.user.age);
                }
            },
            error:function(response){          // 如果请求失败，则会执行error函数
                alert("出错" + response);
            }
        });

        $("#update").click(function (){
            let username = $("#username").val();
            let password = $("#password").val();
            let age = $("#age").val();
            $.ajax({                    // 标准化模板，不用死记  // jquery中的任何属性名称，不能错误，并且一定区分大小写，所以建议在开发中，尽可能使用ctrl+c复制在修改
                url:"/updateByIdServlet",   // 请求路径
                type:"post",            // 请求的方式，不区分大小写
                async:true,             // 是否异步，true是默认值，false为同步请求
                cache:false,            // 关闭缓存，目的是为了避免部分浏览器缓存加载出错(IE)
                datatype:"json",        // 返回类型，text文本、html页面、json数据
                data:{// 传递给后台参数名和参数值
                    id:id,
                    username:username,
                    password:password,
                    age:age
                },
                success:function(response){        // 如果后端响应成功，则会返回所有数据给到response对象中
                    console.log(response);
                    alert(response.msg);
                    if(response.code === 200) {
                        window.location.href="index.html"
                    }
                },
                error:function(response){          // 如果请求失败，则会执行error函数
                    alert("出错" + response);
                }
            });
        });
    });



</script>
</html>